// my_uno.js

import { Rule, UserShortcuts } from "unocss";

export const rules = [
  ["img-f", { width: "100%", "object-fit": "contain" }],
  ["w-f", { width: "100%" }],
  [/^fl-(\d+)$/, ([, flex]) => ({ flex: `${flex}` })],
];

export const shortcuts = [
  [
    /^f-((c|s|e)(-(c|s|e|b|a))*)$/,
    ([, , align, , justify]) => {
      // String.prototype.match 的匹配结果会有几种情况
      const matches = [
        { prefix: "c", value: "center" },
        { prefix: "s", value: "start" },
        { prefix: "e", value: "end" },
        { prefix: "b", value: "between" },
        { prefix: "a", value: "around" },
      ];
      let style = "";
      let corr = matches.find((ele) => ele.prefix === align);
      style += `flex items-${corr?.value} content-${corr?.value}`;
      if (justify) {
        corr = matches.find((ele) => ele.prefix === justify);
        style += ` justify-${corr?.value}`;
      }
      return style;
    },
  ],
];
